<template>
	<div>
		<mu-list textline="three-line">
			<mu-sub-header>今天</mu-sub-header>
			<div v-for='item of messData' :key='item.id'>
				<mu-list-item avatar :ripple="false" button>
				  <mu-list-item-action>
					<mu-avatar>
					  <img :src="item.avatar">
					</mu-avatar>
				  </mu-list-item-action>
				  <mu-list-item-content>
					<mu-list-item-title>{{item.others}}</mu-list-item-title>
					<mu-list-item-sub-title>
					  {{item.message_info}}
					</mu-list-item-sub-title>
				  </mu-list-item-content>
				</mu-list-item>
				<mu-divider></mu-divider>
			</div>
		</mu-list>
	</div>
</template>

<script>
	export default {
		name: 'message-list',
		data () {
			return {
				messData: [
					{
						"id": "01",
						"avatar": "//z6.sinaimg.cn/auto/resize?img=https%3A%2F%2Fn.sinaimg.cn%2Ffront%2F40%2Fw480h360%2F20190226%2F8KUO-htptaqe5608420.jpg&size=200_134",
						"others": "刘鑫",
						"message_info": "周末要来你这里出差，要不要一起吃个饭呀，实在编不下去了,哈哈哈哈哈哈"
					},
					{
						"id": "02",
						"avatar": "//z1.sinaimg.cn/auto/resize?img=https%3A%2F%2Fn.sinaimg.cn%2Fsinacn20110%2F40%2Fw480h360%2F20190227%2F5402-htptaqf0620622.jpg&size=200_134",
						"others": "飞翔的企鹅",
						"message_info": "我们去看电影，最近有部烂片上映，又有吐槽的了"
					},
					{
						"id": "03",
						"avatar": "//z7.sinaimg.cn/auto/resize?img=https%3A%2F%2Fn.sinaimg.cn%2Ffront%2F40%2Fw480h360%2F20190226%2FLfhe-htptaqe9402360.jpg&size=200_134",
						"others": "郭靖",
						"message_info": "周末一起打LOL"
					}
				]
			}
		}
	}
</script>

<style>
</style>
